<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Title</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;

        }

        body, html {
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center; /* 水平居中 */
            text-align: center;
        }


        body {
            /*background-image: url("https://t.mwm.moe/fj");*/
            background: linear-gradient(slateblue, deepskyblue, lightskyblue);
            background-repeat: no-repeat;
            background-size: 100%;
        }

        pre {
            font-family: Consolas; /* 确保字体是等宽字体 */
            white-space: pre; /* 保留空白符 */
            margin-top: 2%;
        }


        /* 当屏幕宽度小于等于600px时应用的样式*/
        /*@media only screen and (max-width: 600px) {*/
        /*    body {*/
        /*        background-image: url("https://t.mwm.moe/mp") !important;*/
        /*        background-repeat: no-repeat;*/
        /*        background-size: contain; !* 保持图片原始尺寸 *!*/
        /*        background-position: center; !* 确保图片居中 *!*/
        /*        height: 100vh; !* 设置高度为视口高度 *!*/
        /*        display: flex;*/
        /*        align-items: center; !* 垂直居中内容 *!*/
        /*        justify-content: center; !* 水平居中内容 *!*/
        /*    }*/
        /*}*/


        #container {
            width: 100%; /* 容器宽度为100%以确保它占据整个行 */
            display: flex;
            flex-direction: column;
            align-items: center; /* 子元素水平居中 */
            margin: auto;
        }

        #functions {
            margin-top: 0; /* 移除顶部外边距 */
            margin-bottom: 20px; /* 在元素之间添加一点空间 */
            width: fit-content;
            max-width: 90%; /* 防止在小屏幕上溢出 */
            padding: 10px;
            border-radius: 25px;
            background: pink;
            margin: auto;
        }

        #functions:hover {
            box-shadow: 5px 5px 5px palevioletred;
            transition: box-shadow 0.3s;
        }

        button {
            width: 100%; /* 调整宽度以适应容器 */
            height: 40px; /* 给定固定高度 */
            margin-top: 10px;
        }

        button:hover {
            box-shadow: 5px 5px 5px dimgrey;
            transition: box-shadow 0.3s;
        }

        #title {
            text-align: center;
        }

        h1:hover {
            font-size: 220%;
            transition:  0.3s;
        }


    </style>
</head>
<body>

<!--<h4><pre>-->
<!--██╗     ██╗   ██╗██████╗ ██╗   ██╗██╗     ██╗   ██╗██╗-->
<!--██║     ██║   ██║██╔══██╗██║   ██║██║     ██║   ██║██║-->
<!--██║     ██║   ██║██████╔╝██║   ██║██║     ██║   ██║██║-->
<!--██║     ██║   ██║██╔══██╗██║   ██║██║     ██║   ██║╚═╝-->
<!--███████╗╚██████╔╝██████╔╝╚██████╔╝███████╗╚██████╔╝██╗-->
<!--╚══════╝ ╚═════╝ ╚═════╝  ╚═════╝ ╚══════╝ ╚═════╝ ╚═╝-->
<!--</pre></h4>-->

<!--功能区-->
<div id="functions">
    <div id="title">
        <h1>卢布卢</h1>
    </div>
    <!--卢布卢-->
    <button onclick="luBuLu()">卢布卢？</button>
    <!--自定义二选一-->
    <button onclick="chooseOneOfTheTwo()">自定义二选一</button>
    <!--自定义多选一-->
    <button onclick="chooseOneFromMany()">自定义多选一</button>
    <a href="http://www.yingyu5658.cn">作者博客</a>
    <p>推荐使用横屏访问哦</p>
</div>


<!--<div id="output">-->
<!--    结果：-->
<!--    <div id="result">-->
<!--        <p>还没运行过呢！</p>-->
<!--    </div>-->

<!--</div>-->

<script>

    function randomBoolean() {
        theTrue = true;
        theFalse = false;
        let randomResult = Math.random(1)
        if (randomResult > 0.5) {
            return theTrue
        } else {
            return theFalse
        }
    }

    function luBuLu() {
        let result = Math.random(1)
        if (result > 0.5) {
            alert("疯狂的鹿，不停的蛇！！！！！")
        } else {
            alert("别让欲望击穿你的意志")
        }
    }

    function chooseOneOfTheTwo() {
        let choice1 = prompt("请输入第一个选项")
        let choice2 = prompt("请输入第二个选项")
        if (choice1 === "" || choice2 === "") {
            alert("请确保每一个选项都有内容！")
            return
        }
        let result = Math.random(1)
        if (result > 0.5) {
            alert("老天帮你选择了:" + choice1)
        } else {
            alert("老天帮你选择了:" + choice2)
        }
    }

    function chooseOneFromManyRandom() {

        return randomIndex
    }

    function chooseOneFromMany() {
        let userInputChoiceCount = prompt("请输入选项总数")
        if (userInputChoiceCount <= 0) {
            alert("请输入可用的数字！")
            return
        }
        let choices = new Array(userInputChoiceCount)
        for (let i = 0; i < userInputChoiceCount; i++) {
            let choice = prompt("请输入你的第" + (i + 1) + "个选项")
            choices[i] = choice
            // 生成 0 到 userInputChoiceCount - 1 范围内的随机整数
        }
        let randomIndex = Math.floor(Math.random() * userInputChoiceCount)
        // 根据随机索引选择一个选项并显示给用户
        alert("老天帮你选择了: " + choices[randomIndex])
    }


    //傻逼一样的dom操作代码（已废弃）
    // let buttonCoottClickTimes = 0;
    //
    // function randomBoolean() {
    //     result = Math.random(1)
    //     if (result > 0.5) {
    //         return true
    //         console.log(true)
    //     } else {
    //         return false
    //         console.log(false)
    //     }
    //
    // }
    //
    // function luBuLu() {
    //     result = randomBoolean()
    //     result == true ? document.getElementById('result').innerHTML = '疯狂的鹿，不停的蛇！！！' : document.getElementById('result').innerHTML = '别让欲望击穿你的意志'
    // }
    //
    // function chooseOneOfTheTwo() {
    //     if (buttonCoottClickTimes === 0) {
    //         for (let i = 0; i < 2; i++) {
    //             // 创建一个新的 input 元素并赋予唯一 id
    //             var coottInput = document.createElement('input');
    //             coottInput.type = 'text'; // 设置为文本输入类型
    //             coottInput.id = `userOption${i + 1}`; // 唯一 id
    //             coottInput.placeholder = '请输入选项...'; // 提示信息
    //
    //             // 创建一个 br 元素来换行（可选）
    //             var lineBreak = document.createElement('br');
    //
    //             // 获取要插入的容器元素
    //             var container = document.querySelector('#coottInput');
    //             // 如果容器存在，则向其中添加新的 input 和 br 元素
    //             if (container) {
    //                 container.appendChild(coottInput);
    //                 container.appendChild(lineBreak);
    //             }
    //         }
    //
    //         // 创建提交按钮
    //         var coottSubmit = document.createElement('button');
    //         coottSubmit.textContent = "提交";
    //         coottSubmit.className = "submit-button"; // 可选: 添加样式类名
    //
    //         // 为提交按钮添加点击事件监听器
    //         coottSubmit.addEventListener('click', function (event) {
    //             event.preventDefault(); // 防止默认行为，如果需要的话
    //             collectAndChoose();
    //         });
    //
    //         // 将提交按钮添加到容器中
    //         if (container) {
    //             container.appendChild(coottSubmit);
    //         }
    //
    //         buttonCoottClickTimes++;
    //     } else {
    //         alert("你已经点击过一次了！");
    //     }
    //     coottSubmit.addEventListener('click', function (event) {
    //         result = randomBoolean()
    //         if (result) {
    //             document.getElementById('result').innerHTML = '老天帮你选择了第一个'
    //         } else {
    //             document.getElementById('result').innerHTML = '老天帮你选择了第二个'
    //         }
    //     })
    // }
    //
    // let buttonCoottClickTimes = 0;
    // let buttonCofmClickTimes = 0; // 新增用于自定义多选一的点击次数计数器
    //
    // function chooseOneOfTheTwo() {
    //     if (buttonCoottClickTimes === 0) {
    //         for (let i = 0; i < 2; i++) {
    //             var coottInput = document.createElement('input');
    //             coottInput.type = 'text';
    //             coottInput.id = `userOption${i + 1}`;
    //             coottInput.placeholder = '请输入选项...';
    //
    //             var lineBreak = document.createElement('br');
    //
    //             var container = document.querySelector('#coottInput');
    //             if (container) {
    //                 container.appendChild(coottInput);
    //                 container.appendChild(lineBreak);
    //             }
    //         }
    //
    //         var coottSubmit = document.createElement('button');
    //         coottSubmit.textContent = "提交";
    //         coottSubmit.className = "submit-button";
    //
    //         coottSubmit.addEventListener('click', function(event) {
    //             event.preventDefault();
    //             collectAndChoose('coottInput');
    //         });
    //
    //         var container = document.querySelector('#coottInput');
    //         if (container) {
    //             container.appendChild(coottSubmit);
    //         }
    //
    //         buttonCoottClickTimes++;
    //     } else {
    //         alert("你已经点击过一次了！");
    //     }
    // }
    //
    // function chooseOneFromMany() {
    //     if (buttonCofmClickTimes === 0) {
    //         let numberOfOptions = prompt("请输入你想选择的选项数量：", "3");
    //         numberOfOptions = parseInt(numberOfOptions, 10);
    //
    //         if (!isNaN(numberOfOptions) && numberOfOptions > 0) {
    //             for (let i = 0; i < numberOfOptions; i++) {
    //                 var cofmInput = document.createElement('input');
    //                 cofmInput.type = 'text';
    //                 cofmInput.id = `userOption${i + 1}`;
    //                 cofmInput.placeholder = '请输入选项...';
    //
    //                 var cofmLineBreak = document.createElement('br');
    //
    //                 var cofmContainer = document.querySelector('#cofmInput');
    //                 if (cofmContainer) {
    //                     cofmContainer.appendChild(cofmInput);
    //                     cofmContainer.appendChild(cofmLineBreak);
    //                 }
    //             }
    //
    //             var cofmSubmit = document.createElement('button');
    //             cofmSubmit.textContent = "提交";
    //             cofmSubmit.className = "submit-button";
    //
    //             cofmSubmit.addEventListener('click', function(event) {
    //                 event.preventDefault();
    //                 collectAndChoose('cofmInput');
    //             });
    //
    //             var cofmContainer = document.querySelector('#cofmInput');
    //             if (cofmContainer) {
    //                 cofmContainer.appendChild(cofmSubmit);
    //             }
    //
    //             buttonCofmClickTimes++;
    //         } else {
    //             alert("请输入有效的数字！");
    //         }
    //     } else {
    //         alert("你已经点击过一次了！");
    //     }
    // }
    //
    // function collectAndChoose(containerId) {
    //     let userOptions = [];
    //     let container = document.querySelector(`#${containerId}`);
    //     if (container) {
    //         let inputs = container.querySelectorAll('input[type="text"]');
    //         inputs.forEach(input => {
    //             let inputValue = input.value.trim();
    //             if (inputValue !== "") {
    //                 userOptions.push(inputValue);
    //             }
    //         });
    //     }
    //
    //     if (userOptions.length > 0) {
    //         const randomIndex = Math.floor(Math.random() * userOptions.length);
    //         document.getElementById('result').innerHTML = `老天帮你选择了：${userOptions[randomIndex]}`;
    //     } else {
    //         alert("请确保至少填写了一个选项！");
    //     }
    // }


</script>
</body>
</html>

<!-- 看板娘开始 -->
<link href='https://cdn.jsdelivr.net/gh/xiaoyanu/file-test@2021.12.1-2/kbn/pio.css' rel='stylesheet' type='text/css'/>
<!-- 可选位置： left 或 right -->
<div class="pio-container left">
    <div class="pio-action"></div>
    <!-- 高度和宽度根据每个模型的不同 进行调整 -->
    <canvas id="pio" width="170" height="295"></canvas>
</div>
<script src='https://cdn.jsdelivr.net/gh/xiaoyanu/file-test@2021.12.1-2/kbn/l2d.js'></script>
<script src='https://cdn.jsdelivr.net/gh/xiaoyanu/file-test@2021.12.1-2/kbn/pio.js'></script>
<script>
    var pio = new Paul_Pio({
        "mode": "fixed",
        "touch": ["点击提示文字在kbn/pio.js中修改"],
        "hidden": false, //手机端是否隐藏
        "referer": "?欢迎来自 %t 的朋友~",
        "content": {
            "welcome": "?欢迎来到本站！"
        },
        // 可用参数：
        // "leimu" "1" "2" "kangna" "qingye" "shawu" "xiaomai" "zhinai"
        "leimu" : "true",

        // 举例子：
        // "model": ["https://cdn.jsdelivr.net/gh/xiaoyanu/file-test@2021.12.1/kbn/ 可修改参数位置 /model.json"],

        "model": ["https://cdn.jsdelivr.net/gh/xiaoyanu/file-test@2021.12.1/kbn/xiaomai/model.json"],

        "tips": true //如果设置为false则会优先显示welcome中的内容“欢迎~”
    });
</script>
<!-- 看板娘结束 -->